import React from 'react';
import MainStyle from '../../../components/main-style';
import RecommentHeadImg from '../../../assets/result-page-img/recomment/recomment-head';
import Typography from '../../../components/typography';
import styles from './index.module.scss';
import RecommentHandle from '../../../components/recomment-handle';
import OtherStyle from '../../../components/other-style';
import Footer from '../footer';

const { Header } = Typography;
const Other = ({ type, style, data }) => {
  console.log('当前Other data为', data);
  // result用来保存VARk
  return (
    <>
      <MainStyle type={type} data={style} result={data} />
      <img
        src={RecommentHeadImg['recomment_' + type]}
        alt=""
        className={styles.recommentImg}
      />
      <Header type="recommentTitle">
        根据测试结果，系统为你匹配了适合的学习产品：
      </Header>
      <RecommentHandle type={style} />
      <OtherStyle type={style} data={data[1].type} result={data}/>
      <img
        src={RecommentHeadImg['recomment_' + style]}
        alt=""
        className={styles.recommentImg}
      />
      <Header type="recommentTitle">
        根据测试结果，系统为你匹配了适合的学习产品：
      </Header>
      <RecommentHandle type={data[1].type} style={style} />
      <Footer data={data} index={2} type={style} percent={data[2].percent}/>
      <Footer data={data} index={3} type={style} percent={data[3].percent}/>
    </>
  );
};

export default Other;
